<template>
  <div class="ad">
      <!--头部-->
      <!-- <div class="head"></div> -->
      <!--内容-->
      <div class="ad_content">
          <!--banner图-->
          <div >
            <div v-for="item in arr.adv_img">
              <div v-if="item.is_default==1">
                <div class="banner">
                    <img :src="item.obj_url" class="banner_img">
                </div>
              </div>
            </div>
          </div>
          <!--分隔线-->
          <div class="line"></div>
          <!--企业活动信息-->
          <div class="activity">
              <div class="aa">
                  {{arr.res.res_name}}
              </div>
              <div class="bb">
                  <div v-for="(item,index) in this.arr.tag" :key="index">
                    <span>{{item.tag_name}}</span>
                  </div>
              </div>
              <div class="cc" v-for="(item,index) in this.arr.user" :key="index">
                  <img :src="item.avatar_head" class="cc_img">
                  <div class="ccc">
                    <span class="cc_name">{{item.nickname}}</span>
                    <span class="cc_job">{{item.jobs_id}}</span>
                   </div>
                  <span class="cc_company">{{item.storeInfo.store_name}}</span>
              </div>
          </div>
          <!--分隔线-->
          <div class="line"></div>
          <!--奖品-->
          <div class="prize" v-for="x in arr.prize">
              <div class="prize_shu"></div>
              <span class="prize_title">奖品</span>
              <!-- <img src="./img/d1.png" class="prize_point"> -->
              <div class="prize_line"></div>
              <img :src="x.prizeInfo.prize_image" class="prize_photo">
              <span class="prize_name">{{x.prizeInfo.prize_name}}</span>
              <span class="prize_num">数量：{{arr.receive_num}}</span>
              <span class="prize_people">领取人数：{{x.prize_num}}人</span>
          </div>
          <!--分隔线-->
          <div class="line"></div>
          <!--广告说明-->
          <div class="advert">
              <div class="advert_shu"></div>
              <span class="advert_title">广告说明</span>
              <div class="advert_line"></div>
          </div>
          <div class="advert_wz">
              {{arr.res.res_details}}
          </div>
          <div class="advert_img">
            <div v-for="item in arr.adv_img">
                <div v-if="item.is_default==0">
                    <img :src="item.obj_url" alt="">
                </div>
            </div>
          </div>
          <!--分隔线-->
          <div class="line"></div>
          <div class="firm">
              <div class="firm_shu"></div>
              <span class="firm_title">公司介绍</span>
              <div class="firm_line"></div>
          </div>
          <div class="firm_wz" v-for="(item,index) in this.arr.user" :key="index">
              {{item.storeInfo.details}}
          </div>
          <div class="firm_img">
              <div v-for="item in arr.store_img">
                <div>
                    <img :src="item.obj_url" alt="">
                </div>
            </div>
          </div>
      </div>
  </div>
</template>
<script>
import axios from 'axios'
import PullTo from 'vue-pull-to'
export default {
  name: 'example',
  components: {
    PullTo
  },
  data(){
      return{
          arr:{ },
          token:this.GLOBAL.serverSrc
      }
  },
  created(){
        this.getData()
  },
  methods: {
    getData(){
      var url=this.token+'/resources/resourcesinfo';
      var obj={
        user_id:this.$route.query.userid,
        res_id:this.$route.query.resid
      }
     var thet=this;
      this.$axios.post(url,obj).then(response=>{
          thet.arr=response.data.data
      })
      .catch(function(error) {
          console.log(error);
      });
    },
    refresh(loaded) {
      setTimeout(() => {
        this.getData()
      //  this.dataList.reverse();
        loaded('done');
      }, 2000);
    }
  }
}
</script>
<style lang="scss" scoped>
#ad{
  width:100%;
  height:100%;
  position: fixed;
}
img{pointer-events: none;vertical-align: sub; }
//内容样式
.ad_content{
  width:100%;
  height:100%;
  // position:fixed;
  // top:0.64rem;
  overflow-y: scroll;
  overflow-x: hidden;
  //banner图样式
  .banner{
    width:100%;
    height:2rem;
    .banner_img{
      width:100%;
      height:100%;
    }
  }
  //分隔线样式
  .line{
    width:100%;
    height:0.07rem;
    background:rgb(247,247,247);
  }
  //企业活动信息样式
  .activity{
    width:100%;
    display:flex;
    flex-wrap: wrap;
    justify-content:center;
    .aa{
      width:100%;
      height:0.5rem;
      display:flex;
      align-items:center;
      color:#2A2A2A;
      font-size:0.19rem;
      font-weight:bold;
      margin-left: 0.2rem;
    }
    .bb{
      width:3.3rem;
      //height:0.6rem;
      display:flex;
      span{
        display:inline-block;
        padding:0.01rem 0.03rem;
        color:#00B799;
        font-size:0.12rem;
        background:rgb(227,250,246);
        margin-bottom:0.04rem;
      }
    }
    .cc{
      width:3.3rem;
      height:0.75rem;
      position: relative;
      border-top:0.01rem solid #EEEEEE;
      .cc_img{
        width:0.45rem;
        height:0.45rem;
        border-radius:50%;
        position:absolute;
        top:0.11rem;
        left:0;
      }
      .ccc{
        width:1.6rem;
        position: absolute;
        top:0.16rem;
        left:0.53rem;
        .cc_name{
          color:#1B1B1B;
          font-size:0.15rem;
          font-weight:bold;
        }
        .cc_job{
          padding:0.01rem 0.03rem;
          color:#46DCC3;
          font-size:0.1rem;
          background:rgb(227,250,246);
          margin-left:0.05rem;
        }
      }
      .cc_company{
        color:#636363;
        font-size:0.12rem;
        position: absolute;
        top:0.4rem;
        left:0.5rem;
      }
    }
  }
  //奖品样式
  .prize{
    width:100%;
    height:1.18rem;
    background:#FFFFFF;
    position: relative;
    .prize_shu{
      width:0.02rem;
      height:0.1rem;
      background:#44DCC3;
      position: absolute;
      top:0.18rem;
      left:0.15rem;
    }
    .prize_title{
      color:#1B1B1B;
      font-size:0.15rem;
      position: absolute;
      top:0.15rem;
      left:0.24rem;
    }
    .prize_point{
      width:0.07rem;
      height:0.14rem;
      position: absolute;
      top:0.15rem;
      left:3.45rem;
    }
    .prize_line{
      width:3.44rem;
      height:0.01rem;
      background:#EEEEEE;
      position: absolute;
      top:0.4rem;
      left:0.17rem;
    }
    .prize_photo{
      width:0.48rem;
      height:0.48rem;
      position: absolute;
      top:0.53rem;
      left:0.2rem;
      border-radius:0.05rem;
    }
    .prize_name{
      color:#1B1B1B;
      font-size:0.14rem;
      position: absolute;
      top:0.61rem;
      left:0.8rem;
    }
    .prize_num{
      color:#939393;
      font-size:0.11rem;
      position: absolute;
      top:0.84rem;
      left:0.8rem;
    }
    .prize_people{
      color:#939393;
      font-size:0.11rem;
      position: absolute;
      top:0.84rem;
      left:1.41rem;
    }
  }
  //广告样式
  .advert{
    width:100%;
    height:0.5rem;
    background:#FFFFFF;
    position:relative;
    .advert_shu{
      width:0.02rem;
      height:0.1rem;
      background:#44DCC3;
      position: absolute;
      top:0.13rem;
      left:0.14rem;
    }
    .advert_title{
      color:#1B1B1B;
      font-size:0.15rem;
      position: absolute;
      top:0.11rem;
      left:0.23rem;
    }
    .advert_line{
      width:3.44rem;
      height:0.01rem;
      background:#EEEEEE;
      position: absolute;
      top:0.35rem;
      left:0.16rem;
    }
  }
  .advert_wz{
    width:3.33rem;
    margin:auto;
    color:#636363;
    font-size:0.15rem;
    margin-bottom:0.2rem;
  }
  .advert_img{
    width:3.33rem;
    display: flex!important;
    //height:0.95rem;
    margin:auto;
    div{
      //float:left!important;
      display: flex!important;
      img{
        width:0.75rem;
        height:0.75rem;
        border-radius:0.05rem;
        margin-right:0.04rem;
        margin-bottom:0.2rem;
      }
    }
  }
  //公司介绍样式
  .firm{
    width:100%;
    height:0.5rem;
    background:#FFFFFF;
    position: relative;
    .firm_shu{
      width:0.02rem;
      height:0.1rem;
      background:#44DCC3;
      position: absolute;
      top:0.13rem;
      left:0.16rem;
    }
    .firm_title{
      color:#1B1B1B;
      font-size:0.15rem;
      position: absolute;
      top:0.11rem;
      left:0.25rem;
    }
    .firm_line{
      width:3.44rem;
      height:0.01rem;
      background:#EEEEEE;
      position: absolute;
      top:0.35rem;
      left:0.18rem;
    }
  }
  .firm_wz{
    width:3.33rem;
    margin:auto;
    color:#636363;
    font-size:0.15rem;
    margin-bottom: 0.2rem;
  }
  .firm_img{
    width:3.33rem;
    //height:0.95rem;
    margin:auto;
    margin-bottom:0.1rem;
    div{
      float:left!important;
      img{
        width:0.75rem;
        height:0.75rem;
        border-radius:0.05rem;
        margin-right:0.04rem;
        margin-bottom:0.8rem;
      }
    }
  }
  .a{
    width:100%;
    height:1.18rem;
    background:yellow;
  }
}
</style>
